<script >
export default {
    name: 'NavHeader',
    methods: {
        toCase() {
            this.$router.push('/case');
        }
    }
}
    
</script>

<template>
  <div class="navHeader">
        <div class="left"><span>首页</span></div>
        <div class="center">
            <div>
                <span>地区管理</span>
            </div>
            <div @click="toCase">
                <span>案例管理</span>
            </div>
            <div>
                <span>推送管理</span>
            </div>
            <div>
                <span>消息管理</span>
            </div>
            <div>
                <span>账号管理</span>
            </div>
        </div>
  </div>
</template>

<style scoped>
    .navHeader {
        width: 100%;
        background-color: rgb(216, 31, 62);
        height: 50px;
        display: flex;
        flex-direction: row;
        padding:  0px 80px;
        color: white;
    }
    .left {
        width: 15%;
    }
    .center {
        width: 80%;
        display: flex;
        flex-direction: row;
    }  
    .center div{
        padding: 0px 70px;
    }
</style>
